/* 面试管理页面响应式样式 */

/* 中等屏幕适配 (1024px - 1366px) */
@media (max-width: 1366px) {
    .layui-form {
        padding: 15px 20px 0 0;
    }
    
    .layui-card-body {
        padding: 10px;
    }
    
    .tree-table {
        min-width: 1000px;
    }
    
    .layui-btn-xs {
        padding: 0 8px;
        font-size: 11px;
    }
}

/* 小屏幕适配 (768px - 1024px) */
@media (max-width: 1024px) {
    .layui-form {
        padding: 10px 15px 0 0;
    }
    
    .tree-table {
        min-width: 900px;
    }
    
    /* 搜索表单在中等屏幕下调整布局 */
    .search-form-responsive .layui-col-md3 {
        width: 50% !important;
        margin-bottom: 10px;
    }
    
    .search-form-responsive .layui-col-md6 {
        width: 100% !important;
        margin-bottom: 10px;
    }
    
    .status-tag {
        font-size: 11px;
        padding: 1px 6px;
    }
}

/* 平板和小屏幕适配 (480px - 768px) */
@media (max-width: 768px) {
    .layui-card-body {
        padding: 8px;
    }
    
    .tree-table {
        min-width: 800px;
    }
    
    /* 搜索表单在小屏幕下单列显示 */
    .search-form-responsive .layui-col-md3,
    .search-form-responsive .layui-col-md6 {
        width: 100% !important;
        margin-bottom: 10px;
    }
    
    .layui-form-label {
        width: 80px !important;
        padding: 9px 10px;
    }
    
    .layui-input-block {
        margin-left: 90px !important;
    }
    
    .layui-btn-xs {
        padding: 0 6px;
        font-size: 10px;
        height: 24px;
        line-height: 24px;
    }
    
    .status-tag {
        font-size: 10px;
        padding: 1px 4px;
    }
}

/* 手机屏幕适配 (320px - 480px) */
@media (max-width: 480px) {
    .layui-card-body {
        padding: 5px;
    }
    
    .tree-table {
        min-width: 700px;
    }
    
    .layui-form-label {
        width: 70px !important;
        padding: 9px 8px;
        font-size: 12px;
    }
    
    .layui-input-block {
        margin-left: 80px !important;
    }
    
    .layui-input {
        height: 32px !important;
        line-height: 32px !important;
    }
    
    .layui-btn {
        height: 32px !important;
        line-height: 32px !important;
        padding: 0 12px;
    }
    
    .layui-btn-xs {
        padding: 0 4px;
        font-size: 9px;
        height: 20px;
        line-height: 20px;
    }
}

/* 弹窗响应式样式 */
.modal-responsive {
    max-width: 95vw !important;
    max-height: 95vh !important;
}

.modal-content-responsive {
    max-height: calc(95vh - 100px);
    overflow-y: auto;
}

/* 弹窗内表单响应式 */
@media (max-width: 1200px) {
    .modal-form-grid .layui-col-md4 {
        width: 50% !important;
        margin-bottom: 15px;
    }
}

@media (max-width: 768px) {
    .modal-form-grid .layui-col-md4,
    .modal-form-grid .layui-col-md8 {
        width: 100% !important;
        margin-bottom: 15px;
    }
    
    .modal-form-grid .layui-form-label {
        width: 90px !important;
    }
    
    .modal-form-grid .layui-input-block {
        margin-left: 110px !important;
    }
    
    /* 小屏幕下弹窗内容调整 */
    .modal-content-responsive {
        padding: 15px 20px !important;
    }
}

/* 超小屏幕下的特殊处理 */
@media (max-width: 480px) {
    .modal-form-grid .layui-form-label {
        width: 80px !important;
        font-size: 12px;
    }
    
    .modal-form-grid .layui-input-block {
        margin-left: 90px !important;
    }
    
    .modal-content-responsive {
        padding: 10px 15px !important;
    }
    
    /* 弹窗按钮区域 */
    .layui-btn {
        font-size: 12px !important;
        padding: 0 10px !important;
    }
} 